import { createRouter, createWebHashHistory, createWebHistory, Router } from 'vue-router'
import { RouteRecordRaw } from 'vue-router'

const Layout = () => import('@/layout/index.vue')

// 静态路由
export const basicRoutes: Array<RouteRecordRaw> = [
  {
    // 找不到路由时404页面
    path: "/:pathMatch(.*)*",
    meta: {
      hidden: true,
    },
    component: () => import('@/views/error-page/404.vue')
  },
  {
    path: "/login",
    name: "Login",
    meta: {
      title: "登录",
      hidden: true,
      noTagsView: true
    },
    component: () =>import('@/views/login/index.vue'),
  },
  {
    path: '/404',
    name: 'Page404',
    meta: {
        title: '404',
        hidden: true,
        noTagsView: true
    },
    component: () => import('@/views/error-page/404.vue'),
  },
  {
    path: "/redirect",
    component: Layout,
    meta: {
      hidden: true
    },
    children: [
      {
        path: "/redirect/:path*",
        component: () => import("@/views/redirect/index.vue")
      }
    ]
  },
  
  {
    path: '/',
    redirect: '/home',
    component: Layout,
    children: [
      {
        path: 'home',
        name: 'Home',
        meta: {
          title: 'dashboard',
          icon: 'el-icon-s-home',
          noCache: true,
          affix: true
        },
        component: () => import('@/views/index.vue'),
      },
    ]
  },
]

// 动态模块权限路由
const modulesFiles = require.context("./modules", true, /\.ts$/);
const modules = modulesFiles.keys().reduce((modules, modulePath) => {
  const value = modulesFiles(modulePath);
  modules.push(value.default);
  if(modules.length > 1) modules.sort((a,b) => a.meta?.sort && b.meta?.sort ? (a.meta.sort - b.meta.sort) : -1)
  return modules
}, [] as Array<RouteRecordRaw>);

/**
 * 路由配置项
 * path: '/'                     // 路由地址
 * name: ' Home'                 // 设定路由的名字，一定要填写不然使用<keep-alive>时会出现各种问题
 * redirect: noRedirect          // 当设置 noRedirect 的时候该路由在面包屑导航中不可被点击
 * meta: {
    title: 'title'               // 设置该路由在侧边栏和面包屑中展示的名字
    icon: 'svg-name'             // 设置该路由的图标，对应路径src/assets/icons/svg
    hidden: true                 // 当设置 true 的时候该路由不会再侧边栏出现 如404，login等页面(默认 false)
    breadcrumb: false            // 如果设置为false，则不会在breadcrumb面包屑中显示(默认 true)
    noCache: true                // 如果设置为true，则不会被 <keep-alive> 缓存(默认 false)
    affix: true                  // 如果设置为true，则会一直固定在tag项中(默认 false)
    noTagsView: true             // 如果设置为true，则不会出现在tag中(默认 false)
    alwaysShow: true             // 当你一个路由下面的 children 声明的路由大于1个时，自动会变成嵌套的模式，
                                    只有一个时，会将那个子路由当做根路由显示在侧边栏，
                                    若你想不管路由下面的 children 声明的个数都显示你的根路由，
                                    你可以设置 alwaysShow: true，这样它就会忽略之前定义的规则，
    savedPosition: 0             // 设置页面初始滚动条位置
   }
   children:[]                   // 子集
 */
export const asyncRoutes = modules

const router: Router = createRouter({
  history: process.env.NODE_ENV === 'production' ? createWebHistory() : createWebHashHistory(),
  routes: basicRoutes,
  scrollBehavior(to, from, savedPosition) {
    return new Promise((resolve, reject) => {
      if (savedPosition) {
        return savedPosition;
      } else {
        if (from.meta.saveSrollTop) {     // 滚动条位置
          const top: number = document.documentElement.scrollTop || document.body.scrollTop;
          resolve({ left: 0, top: top || 0 });
        }
      }
    });
  },
})

export const resetRouter = () => {
  const newRouter: Router = router;
  (router as any).matcher = (newRouter as any).matcher // reset router
}

export default router
